// 点位分布统计模块
(function() {
  // 1. 实例化对象
  var myChart = echarts.init(document.querySelector(".pie1 .chart"));

  // 渲染函数
  function render(data = Config.regionData) {
    // 2. 指定配置项和数据
    var option = {
      legend: {
        top: "90%",
        itemWidth: 10,
        itemHeight: 10,
        textStyle: {
          color: "rgba(255,255,255,.5)",
          fontSize: "12"
        }
      },
      tooltip: {
        trigger: "item",
        formatter: "{a} <br/>{b} : {c} ({d}%)"
      },
      color: Config.colors.pie1,
      series: [
        {
          name: "点位统计",
          type: "pie",
          radius: ["10%", "70%"],
          center: ["50%", "42%"],
          roseType: "radius",
          data: data,
          label: {
            fontSize: 10
          },
          labelLine: {
            length: 10,
            length2: 10
          }
        }
      ]
    };

    // 3. 配置项和数据给实例对象
    myChart.setOption(option);
  }

  // 初始渲染
  render();

  // 4. 当浏览器缩放时，图表也等比例缩放
  window.addEventListener("resize", function() {
    myChart.resize();
  });

  // 监听区域点击事件
  myChart.on('click', function(params) {
    EventBus.emit("regionSelected", {
      name: params.name,
      value: params.value
    });
  });

  // 监听技术选择事件
  EventBus.on("techSelected", function(tech) {
    // 根据所选技术调整区域数据
    const factor = tech.value / 50;

    const newData = Config.regionData.map(item => {
      return {
        name: item.name,
        value: Math.max(1, Math.round(item.value * factor))
      };
    });

    render(newData);
  });
})();
